<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link href="/static/admin/css/default.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="/static/admin/easyui1.8.6/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="/static/admin/easyui1.8.6/themes/icon.css" />
<!--    <script type="text/javascript" src="/static/admin/easyui1.8.6/jquery.min.js"></script>-->
    <link rel="stylesheet" type="text/css" href="/static/admin/js/fancybox/source/jquery.fancybox.css" />
    <script type="text/javascript" src="/static/admin/js/fancybox/lib/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="/static/admin/easyui1.8.6/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="/static/admin/easyui1.8.6/locale/easyui-lang-zh_CN.js"></script>

    <script type="text/javascript" src="/static/admin/js/fancybox/source/jquery.fancybox.pack.js"></script>
</head>
<body>
<div id="toolbar">
    <input type="text" class="easyui-textbox" data-options="prompt:'名称',icons: [{
		iconCls:'icon-search',
		handler: function(e){
		    let word = $(e.data.target).textbox('getValue');
			$('#dataList').treegrid('reload',{name:word});
		}
	}]" />
    <a onclick="add()" class="easyui-linkbutton" data-options="iconCls:'icon-add'">添加品牌</a>
    <a onclick="edit()" class="easyui-linkbutton" data-options="iconCls:'icon-edit'">编辑选中项</a>
</div>
<table id="dataList" class="easyui-treegrid">

</table>

<script type="text/javascript">

    $('#dataList').treegrid({
        url:'/admin/brand/index',
        idField:'id',
        treeField:'name',
        pagination:true,
        columns:[[
            {field: 'ck',checkbox:true},
            {field: 'brand_logo',title: 'Logo',formatter:function (val,row,index){
                    if(row.level==1 && val!=null){
                        return '  <a class="fancybox-effects-c" href="' + val + '" title="logo预览">\n' +
                            '<img src="'+val+'" style="width: 50px;height: 50px"/>' +
                            '  </a>';
                    } else {
                        return '-';
                    }
                }},
            {title:'品牌/厂牌/系列',field:'name',width:180},
            {title:'国家',field:'country',width:180,formatter:function (val, row, index){
                    if(row.level==1){
                        return val;
                    } else {
                        return '-';
                    }
                }},
            {field:'first_letter',title:'首字母',width:60,align:'right'},
            {field:'status',title:'状态',width:100,align:'center',formatter:function (val, row, index){
                if(val==1){
                    return '<span class="tag tag-success">正常</span>';
                } else {
                    return '<span class="tag tag-secondary">不显示</span>';
                }
                }},
        ]]
    });

    $(".fancybox-effects-c").fancybox({
        wrapCSS    : 'fancybox-custom',
        closeClick : true,
        openEffect : 'none',
        helpers : {
            title : {
                type : 'inside'
            },
            overlay : {
                css : {
                    'background' : 'rgba(238,238,238,0.85)'
                }
            }
        }
    });

</script>

</body>
</html>